<template>
    <van-skeleton title :row="15" :loading="loading">
        <div id="registerRes" class="fs-15 fw-400">
            <div
                class="res-icon dis-flex flex-dir-column flex-x-center flex-y-center"
            >
                <img src="../../../assets/img/success.png" alt="" />
                <span>认证成功</span>
            </div>
            <div class="info">
                <div class="info-item dis-flex flex-x-between flex-y-center">
                    <span>手机号</span>
                    <span>{{ userInfo.userName }}</span>
                </div>
                <div class="info-item dis-flex flex-x-between flex-y-center">
                    <span>密码</span>
                    <span>{{ userInfo.identityCardNumber }}</span>
                </div>
            </div>

            <van-button
                class="common-btn-big fw-600 b-red"
                :loading="loading"
                type="primary"
                loading-type="spinner"
                loading-text="点击复制账户信息"
                @click="copy"
                >点击复制账户信息</van-button
            >
        </div>
    </van-skeleton>
</template>

<script>
    import { Toast } from "vant"
    export default {
        props: [], // 父辈向子辈传参
        name: 'registerRes',
        components: { // 组件的引用

        },
        data() {
            return {
                userInfo: {},
                loading: false
            }
        },
        methods: {
            getUserInfo() {
                this.$api.app.getUserInfoApi().then((res) => {
                    this.userInfo = res.data
                    let data = this.$store.state.user.userInfo
                    let obj = {
                        ...data,
                        realNameState: res.data.realNameState
                    }
                    console.log("实名信息", obj);
                    this.$store.commit('setUserInfo', obj)
                    this.loading = false
                }).catch((err) => {
                    Toast(err.message)
                });
            },
            copy(){
                
            }
        },
        computed: {},
        watch: {},
        created() { },
        mounted() {
            this.getUserInfo()
        },
    }
</script>
    
<style scoped lang='scss'>
    .van-button--primary {
        border: none;
        background: linear-gradient(180deg, #f53137, #f53137);
        margin-top: 45px !important;
    }
    #registerRes {
        height: 100vh;
        background-color: #f6f8fa;
        padding: 0 15px;
        line-height: 22px;
        color: #0b1526;
        display: flex;
        flex-direction: column;
        align-items: center;
        .res-icon {
            padding-top: 56px;
            & > img {
                width: 88px;
                height: 80px;
                margin-bottom: 9px;
            }
        }

        .info {
            width: 345px;
            background: #ffffff;
            border-radius: 10px;
            padding: 0 15px;
            box-sizing: border-box;
            margin-top: 30px;
            .info-item {
                border-bottom: 1px solid #f6f8fa;
                padding: 15px 0;
                & > span:nth-child(1) {
                    color: #5d667b;
                }
            }
        }

   
    }
</style>